<template>
  <div class="autoBillResult">
    <el-form :model="results" :inline="true" size="mini" ref="ruleForm" label-width="100px">
      <el-form-item label="账单号">
        <el-input v-model="results.orderNum"></el-input>
      </el-form-item>
      <el-form-item label="错误类型" prop="region">
        <el-select clearable v-model="results.type">
          <el-option :label="item.names" v-for="(item, index) in type" :key="index" :value="item.id"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="状态" prop="date1">
        <el-select clearable v-model="results.state">
          <el-option :label="item.names" v-for="(item, index) in stateList" :key="index" :value="item.id"></el-option>
        </el-select>
      </el-form-item>
      <!-- <el-form-item label="票号">
          <el-input v-model="results.ticketNum"></el-input>
        </el-form-item> -->
      <el-form-item label="操作时间">
        <el-date-picker value-format="yyyy-MM-dd" v-model="results.time" type="date" placeholder="选择日期">
        </el-date-picker>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="viewBillDetails('ruleForm')">查询</el-button>
      </el-form-item>
    </el-form>
    <el-table :data="tableData"
      :header-cell-style="{ color: '#fff', background: '#6090EC', fontSize: '11px', fontWeight: 'normal'}" size="mini"
      border class="account_table">
      <el-table-column prop="billExceptionId" label="账单号" width="150">
      </el-table-column>
      <el-table-column prop="exceptionType" label="错误类型" width="120">
        <template slot-scope="scope">
          <template v-if="scope.row.exceptionType=='duplicateTicketNumber'">票号重复</template>
          <template v-if="scope.row.exceptionType=='returnMoneyLess'">少收客人退票费</template>
          <template v-if="scope.row.exceptionType=='returnMoneyMore'">多收客人退票费</template>
          <template v-if="scope.row.exceptionType=='crmLess'">CRM没有对方有</template>
          <template v-if="scope.row.exceptionType=='crmMore'">CRM有对方没有</template>
          <template v-if="scope.row.exceptionType=='buyMoneyLess'">少收客人票价</template>
          <template v-if="scope.row.exceptionType=='buyMoneyMore'">多收客人票价</template>
          <template v-if="scope.row.exceptionType=='normal'">正常</template>
          <template v-if="scope.row.exceptionType=='duplicateTicketNumber'">票号重复</template>
        </template>
      </el-table-column>
      <el-table-column prop="ticketingChannel" label="出票渠道" width="120">
      </el-table-column>
      <el-table-column prop="status" label="状态" width="120">
        <template slot-scope="scope">
          <template v-if="scope.row.status=='1'">待系统自动处理</template>
          <template v-if="scope.row.status=='2'">待人工处理</template>
          <template v-if="scope.row.status=='3'">处理完成</template>
        </template>
      </el-table-column>
      <!-- <el-table-column prop="remark" label="备注">
      </el-table-column> -->
      <el-table-column prop="ticketNumber" label="票号" width="150">
      </el-table-column>
      <!-- <el-table-column prop="ticketNumber" label="票号"> </el-table-column> -->
      <el-table-column prop="operationtime" label="操作时间" width="120"></el-table-column>
      <el-table-column prop="operatorName" label="操作人" width="200">
      </el-table-column>
      <el-table-column label="备注" width="300">
        <template slot-scope="scope">
          <el-input type="textarea" v-model="scope.row.remarkhuitian" :rows="1" size="mini"></el-input>
        </template>
      </el-table-column>
      <el-table-column label="回填票号" width="300">
        <template slot-scope="scope">
          <el-input type="textarea" v-model="scope.row.ticketNumberhuitian" :rows="1" size="mini"></el-input>
        </template>
      </el-table-column>
      <el-table-column label="操作" width="200">
        <template slot-scope="scope">
          <el-popconfirm title="确认回填数据吗" @confirm="backfillconfirm">
            <el-button slot="reference" v-if="scope.row.exceptionType!='CRM没有对方有'" type="primary" size="mini"
              @click="reconciliation(scope.row)">回填</el-button>
          </el-popconfirm>
        </template>·  
      </el-table-column>
    </el-table>
    <div class="block">
      <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage"
        :page-sizes="[10, 15, 20]" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper"
        :total="pageTotal">
      </el-pagination>
    </div>
  </div>
</template>
<script>
  export default {      
    name: 'autoBillResult',
    components: {},
    data() {
      return {
        remarkhuitian: "",
        ticketNumberhuitian: "",
        flightOrderInfoTicketsId: null,
        pageSize: 10,
        currentPage: 1,
        pageTotal: 0,
        results: {
          orderNum: '',
          type: '',
          state: '',
          ticketNum: "",
          time: ''
        },
        tableData: [{
          a:"1"
        }],
        stateList: [{
            id: "1",
            names: "待系统自动处理"
          },
          {
            id: "2",
            names: "待人工处理"
          },
          {
            id: "3",
            names: "处理完成"
          }
        ],
        type: [{
            id: 'returnMoneyLess',
            names: "少收客人退票费",
          },
          {
            id: 'returnMoneyMore',
            names: "多收客人退票费",
          },
          {
            id: 'crmLess',
            names: "CRM没有对方有",
          },
          {
            id: 'crmMore',
            names: "CRM有对方没有",
          },
          {
            id: 'buyMoneyLess',
            names: "少收客人票价",
          },
          {
            id: 'buyMoneyMore',
            names: "多收客人票价",
          },
          {
            id: 'normal',
            names: "正常",
          },
          {
            id: 'duplicateTicketNumber',
            names: "票号重复",
          },
        ],
      }
    },
    methods: {
      // 回填确定回调
      backfillconfirm() {
        this.getbackfillTicketNumber()
      },
      // 对账
      reconciliation(row) {
        console.log(row)
        this.flightOrderInfoTicketsId = row.billExceptionId
        this.remarkhuitian = row.remarkhuitian
        this.ticketNumberhuitian = row.ticketNumberhuitian
      },
      // 回填单号
      getbackfillTicketNumber() {
        console.log(1)

        console.log(this.flightOrderInfoTicketsId)
        console.log(this.remark)
        this.$axios.getbackfillTicketNumber({
          id: this.flightOrderInfoTicketsId,
          remark: this.remarkhuitian,
          ticketNum: this.ticketNumberhuitian
        }).then((res) => {
          console.log(res)
          if (res.code == '200') {
            this.$message({
              message: '回填成功',
              type: 'success'
            });
            this.getfinanceAutobillExceptionList()
          }
        })
      },
      // 查询数据接口
      getfinanceAutobillExceptionList() {
        this.$axios.getfinanceAutobillExceptionList({
          orderNum: this.results.orderNum,
          type: this.results.type,
          state: this.results.state,
          ticketNum: this.results.ticketNum,
          time: this.results.time,
        }).then(res => {
          console.log(res)
          this.tableData = res.data
          this.pageTotal = res.total
        })
      },
      // 查询按钮
      viewBillDetails() {
        localStorage.setItem("pageSize", 10);
        localStorage.setItem("pageNum", 1);
        this.getfinanceAutobillExceptionList()
      },
      // 分页
      handleSizeChange(value) {
        console.log("1", value);
        localStorage.setItem("pageSize", value);
        localStorage.setItem("pageNum", 1);
        this.getfinanceAutobillExceptionList();
        this.pageSize = value;
      },
      handleCurrentChange(value) {
        // debugger;
        localStorage.setItem("pageNum", value);
        localStorage.setItem("pageSize", this.pageSize);
        this.getfinanceAutobillExceptionList();
      },

    },
    mounted() {
      this.getfinanceAutobillExceptionList()
    }

  }
</script>

<style scoped>
  .autoBillResult {
    margin: 30px 0 0 30px;
  }
</style>